<template>
	<view>
		<view  style="" :style="[{...props.contentStyle},{...style}]">
			<view class="scheme-1" >
				<up-navbar
					:fixed="false"
					v-if="schemeOne"
					:isIcon="isIcon"
					bgColor="transparent"
					:height="pageData.height"
					:title="title"
					@rightClick="rightClick"
					:autoBack="true"
					:safeAreaInsetTop="true"
					:placeholder="true"
				>
				</up-navbar>
				
				<view class="" v-else>
					<slot></slot>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {reactive, ref, onMounted} from "vue";
	import {onLoad} from "@dcloudio/uni-app";
	
	// 接受父级的数据
	const props = defineProps({
		// 是否使用方案一
		schemeOne: {
			type: Boolean,
			default: true
		},
		// 是否使用方案是否显示左侧箭头图标
		isIcon: {
			type: Boolean,
			default: true
		},
		// 标题
		title: {
			type: String,
			default: '标题'
		},
		contentStyle: {
			type: Object,
			default: {}
		}
	})
	// 导出事件函数
	const emits = defineEmits(['click'])
	
	// 暴露组件内部函数
	defineExpose([])
	
	// 获取右上角胶囊菜单信息（高、宽、距上距离等）/
	const menu = uni.getMenuButtonBoundingClientRect();
	console.log('menu', menu)
	
	const pageData = reactive({
		height: menu.height+menu.top + 'px',
	})
	
	const style = reactive({
		height: menu.height + menu.top + 'px',
		display: 'flex',
		alignItems: 'flex-end',
		paddingBottom: '20rpx'
	})
	
	// 左侧点击事件
	function rightClick() {
		emits("click", true)
	}


</script>

<style lang="scss" scoped>
	.scheme-1 {
		
	}
</style>